var $image = $("#image");
// 1.2 配置选项
const options = {
  // 纵横比
  aspectRatio: 1,
  // 指定预览区域
  preview: ".img-preview",
};

// 1.3 创建裁剪区域
$image.cropper(options);

$("#btnChooseImage").click(function () {
  $("#file").click();
});

$("#file").change(function (e) {
  let file = e.target.files[0];
  // 获取用户选择的文件
  var filelist = e.target.files;
  if (filelist.length === 0) {
    return layer.msg("请选择照片！");
  }

  var newImgURL = URL.createObjectURL(file);
  $image
    .cropper("destroy") // 销毁旧的裁剪区域
    .attr("src", newImgURL) // 重新设置图片路径
    .cropper(options);
});

$("#btnUpload").click(function () {
  var dataURL = $image
    .cropper("getCroppedCanvas", {
      // 创建一个 Canvas 画布
      width: 100,
      height: 100,
    })
    .toDataURL("image/png"); // 将 Canvas 画布上的内容，转化为 base64 格式的字符串
  $.ajax({
    type: "post",
    url: "/my/update/avatar",
    data: {
      avatar: dataURL,
    },
    success(res) {
      layui.layer.msg(res.message);
      if (res.status) return;
      window.parent.getUserInfo();
    },
  });
});
